<template>
  <form id="form1">
    <div id="container">
      <div class="content">
        <div class="tit">
          <a>首页</a>&gt;
          <a>会员信息</a>&gt;
          <a>会员展示</a>
        </div>
        <div class="news">
          <div class="news_l">
            <div class="submenu_m">
              <a v-for="sub in subMenus" :href="sub.url"
                :class="sub.label == '会员信息' ? 'current' : ''">{{sub.label}}</a>
            </div>
            <div class="news_select">
              <select v-model="listQuery.type" id="Member_Type" @change="fetchList">
                <option value="">会员类别</option>
                <option value="HUI">会长单位</option>
                <option value="FUHUI">副会长单位</option>
                <option value="CWLISHI">常务理事单位</option>
                <option value="LISHI">理事单位</option>
                <option value="JIANSHI">监事单位</option>
                <option value="HUIYUAN">会员单位</option>
              </select>
              <div class="sel">
                <input type="text" v-model="listQuery.key" id="Keyword" placeholder="请输入关键词" value="" class="seltt">
                <input type="button" @click="fetchList" value="搜索" id="bt_Search" class="mit">
              </div>

            </div>
            <div class="newslist">
              <ul>
                <li v-for="(item,index) in list">
                  <span class="num">
                    <h2>{{index + 1}}</h2>
                  </span>
                  <span class="name">
                    <a :href="'/news9?id='+item.id">{{item.name}}</a>
                      [{{item.type.split(":")[1]}}]
                  </span>
                  <br>
                  <span class="cata">地址：{{item.address}}</span>

                  <span class="cata">联系人：{{item.contactName}}</span>
                  <span class="cata">电话：{{item.phone}}</span>
                  <span class="weburl">
                  </span>
                </li>
              </ul>
            </div>
            <div class="divPage">
              <div class="pages">
                <el-pagination
                  style="text-align: center;"
                  v-show="total>0"
                  :total="total"
                  :current-page.sync="listQuery.page"
                  :page-size.sync="listQuery.size"
                  layout="prev,slot,next"
                  prev-text="上一页"
                  next-text="下一页"
                  @size-change="fetchList"
                  @current-change="fetchList"
                >
                  <span>{{listQuery.page}}/{{ Math.trunc((total+ listQuery.size-1) / listQuery.size)}}</span>
                </el-pagination>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </form>
</template>

<script>
import Data from '@/api/data'

export default {
  name: 'Index',
  props:{
    layout: String
  },
  data() {
    return {
      subMenus: [
        {label:"会员信息", url:"/news7",checked: true},
        {label:"会员掠影", url:"/news8?type2="+encodeURIComponent("会员掠影")},
        {label:"信息交流", url:"/news8?type2="+encodeURIComponent("信息交流")},
        {label:"企业活动", url:"/news8?type2="+encodeURIComponent("企业活动")},
      ],
      total: 0,
      listQuery: {
        page: 1,
        size: 10,
        type:"",
        key: '',
      },
      list:[],
    }
  },
  watch: {
    month: {
    }
  },
  computed: {
  },
  created() {
    this.fetchList()
  },
  methods: {
    async fetchList() {

      var data = this.listQuery;
      if(!data.type) {
        data["typeNo"] = "BRANCH"
      }
      console.log("请求参数",data)
      const res = await Data.get("/branch", data)
      if (res) {
        this.list = res.list
        this.total = res.total
      }
    },
  }
}
</script>

<style lang="scss" scoped>
@import "~@/styles/new_files_m/bootstrap.min.css";
@import "~@/styles/new_files_m/iconfont.css";
@import "~@/styles/new_files_m/comm.css";
@import "~@/styles/new_files_m/info.css";
</style>
